<!--
 * @Author: 赵宇
 * @Description: 
 * @Date: 2023-02-21 16:03:45
 * @LastEditTime: 2023-02-22 11:19:28
 * @LastEditors: zhao 13370229059@163.com
 * @FilePath: \pcj\src\page\home\components\headerInfo.vue
-->
<template>
  <div class="info">
    <ul class="info-item">
      <li>
        <z-button icon="touxiang" circle plain size="small" title="个人资料"></z-button>
      </li>

      <li @click="onOut">
        <z-button icon="out-light" circle plain size="small" title="退出登陆"></z-button>
      </li>
    </ul>
  </div>
</template>

<script setup>
let router = useRouter();
const onOut = () => {
  localStorage.removeItem('token');
  router.push('/login');
};
</script>

<style lang="scss" scoped>
.info {
  padding: 10px;
  margin-left: 10px;
  box-shadow: var(--el-box-shadow-light);
  &-item {
    display: flex;
    li {
      margin: 0 5px;
      cursor: pointer;
      &:hover {
        transform: scale(1.25);
        transition: all 0.5s;
      }
    }
  }
}
</style>
